<template>
  <!--1.在组件中有且仅有一个根标签-->
  <div>
    <h1 v-html="msg"></h1>
  </div>
</template>

<script>
/*以后在单页面组件中，所有的JS代码都写在script标签中*/ 


// Vue实例代码
export default {
  name: 'HelloWorld',
  data () {
    return {
      msg:""
    }
  },
  methods:{ // 定义函数的

  },
  mounted() { // 钩子函数发起请求的
    // 1.发起AJAX请求
    // 2.给你的数据赋值
    this.msg = "我是一个单页面组件";
  },
  watch:{ // 监听属性

  },
  computed:{ // 计算属性

  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<!--scoped：表示当前样式仅作用域当前组件-->
<style scoped>
h1{
  color: red;
}
</style>
